import React, { Component } from 'react';
import { Redirect, Switch, Route } from 'react-router-dom';
import { Layout } from 'antd';

import memoryUtil from '../../utils/memoryUtil';
import LeftNav from '../../components/left-nav';
import Header from '../../components/header';

import Home from '../home/home';
import Category from '../category/category';
import Product from '../product/product';
import Role from '../role/role';
import User from '../user/user';
import Bar from '../charts/charts';
import Line from '../charts/charts';
import Pie from '../charts/charts';
import Order from '../order/order';

import './index.less';

const { Footer, Sider, Content } = Layout;

export default class Admin extends Component {
    // 读取localStorage里的user信息，如果没有，直接跳转到login

    render() {
        // user_key: {
        //     "_id": "bababababa",
        //     "password": "babababa",
        //     "username": "admin",
        //     "create_time": 1234545,
        // }
        const user = memoryUtil.user;
        if (!user._id) {
            // 一般用在事件回调里做
            // this.props.history.replace('/login');
            // 在render里用Redirect标签跳转
            return <Redirect to="/login" />
        }

        return (
            <Layout style={{height: '100%'}}>
                <Sider>
                    <LeftNav />
                </Sider>
                <Layout>
                    <Header/>
                    <Content className="layout-content">
                        <Switch>
                            <Route path="/home" component={Home}/>
                            <Route path="/category" component={Category}/>
                            <Route path="/product" component={Product}/>
                            <Route path="/role" component={Role}/>
                            <Route path="/user" component={User}/>
                            <Route path="/charts/bar" component={Bar}/>
                            <Route path="/charts/line" component={Line}/>
                            <Route path="/charts/pie" component={Pie}/>
                            <Route path="/order" component={Order}/>
                            <Redirect to="/home"/>
                        </Switch>
                    </Content>
                    <Footer style={{ textAlign: 'center', color: '#444444' }}>
                        推荐使用谷歌浏览器，以获得更佳的页面操作体验
                    </Footer>
                </Layout>
            </Layout>
        )
    }
}
